<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=640,initial-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>摇一摇</title>
</head>
<body>
    <div><h1 id="dmEvent"></h1></div>
<script>
    var SHAKE_THRESHOLD = 800;
    var last_update = 0;
    var x, y, z, last_x, last_y, last_z;       
    function deviceMotionHandler(eventData) {        
    var acceleration =eventData.accelerationIncludingGravity;
    var curTime = new Date().getTime();       
    if ((curTime - last_update)> 300) {                
        var diffTime = curTime -last_update;
        last_update = curTime;       
        x = acceleration.x;
        y = acceleration.y;
        z = acceleration.z;       
        var speed = Math.abs(x +y + z - last_x - last_y - last_z) / diffTime * 10000;          
        if (speed > SHAKE_THRESHOLD) {
            alert("shaked!");
            
            // 防止重复摇
            //window.removeEventListener('devicemotion', deviceMotionHandler);
        }
        last_x = x;
        last_y = y;
        last_z = z;
        }
    } 
    
    if (window.DeviceMotionEvent) {
        window.addEventListener('devicemotion', deviceMotionHandler, false);
    } else {
        document.getElementById("dmEvent").innerHTML = "您的设备不支持"
    }
</script>
</body>
</html>